<template>
	<a-table
		ref="tableRef"
		:columns="columns"
		:data-source="dataSource"
		:row-key="(record) => record.id"
		:showHeader="false"
		:pagination="false"
		size="small"
		bordered
	>
		<template #bodyCell="{ column, record, text, index }">
			<template v-if="column.dataIndex === 'key6' && index === 0">
				<template v-if="editIntentTag || text === ''">
					<a-select placeholder="请选择用户标签" :options="intentTagOptions" allowClear @change="changeIntentTag" />
				</template>
				<template v-else>
					<a-button type="link" @click="editIntentTag = true">
						{{ text }}
					</a-button>
				</template>
			</template>
			<template v-if="column.dataIndex === 'key6' && index === 1 && text !== '' && text !== null">
				<a-space>
					{{ text }}
				</a-space>
				<a-tooltip title="明文" v-if="!isSentive()">
					<a-button type="link" @click="showPlaintext(index)" class="icon-button">
						<EyeOutlined />
					</a-button>
				</a-tooltip>
			</template>
			<template v-if="column.dataIndex === 'key6' && (index === 3 || index === 4) && text !== '' && text !== null">
				<a-space>
					{{ text }}
				</a-space>
				<a-tooltip title="明文" v-if="!isSentive()">
					<a-button type="link" @click="showPlaintext(index)" class="icon-button">
						<EyeOutlined />
					</a-button>
				</a-tooltip>
			</template>
			<template v-if="column.dataIndex === 'key4' && index === 4 && text !== '' && text !== null">
				<a-space>
					{{ text }}
				</a-space>
				<a-tooltip title="外呼">
					<a-button type="link" @click="singleCall" class="icon-button">
						<PhoneOutlined />
					</a-button>
				</a-tooltip>
			</template>
		</template>
	</a-table>
</template>

<script setup name="debtor">
	import debtorApi from '@/api/tjzy/debtor/debtorApi'
	import complaintApi from '@/api/tjzy/complaint/complaintApi'
	import tool from '@/utils/tool'
	import caseApi from '@/api/tjzy/case/caseApi'
	import { isSentive } from '@/utils/permission'

	const props = defineProps({
		caseId: String
	})
	const emit = defineEmits({ caseInfo: null, callEvent: null })
	const caseInfo = ref()
	const tableRef = ref()
	const dataSource = ref([])
	const intentTagOptions = tool.dictList('IntentTag')
	const editIntentTag = ref(false)
	const realDebtorCardId = ref()
	const columns = [
		{
			dataIndex: 'key1',
			align: 'right'
		},
		{
			dataIndex: 'key2'
		},
		{
			dataIndex: 'key3',
			align: 'right'
		},
		{
			dataIndex: 'key4'
		},
		{
			dataIndex: 'key5',
			align: 'right'
		},
		{
			dataIndex: 'key6'
		}
	]
	const listInfo = () => {
		debtorApi.getDebtorByCaseId(props.caseId).then((res) => {
			caseInfo.value = JSON.parse(res[res.length - 1].key1)
			//此处赋值用于案件详情拉黑弹框数据重组
			caseInfo.value.complainAmount = res[res.length - 2].key2
			// console.log('res', res);
			emit('caseInfo', caseInfo.value)
			res.pop()
			dataSource.value = res
		})
	}
	const changeIntentTag = (val) => {
		caseApi
			.updateCase({ id: props.caseId, intentTag: val })
			.then((res) => {
				listInfo()
			})
			.finally(() => {
				editIntentTag.value = false
			})
	}
	const saveDebtor = () => {
		debtorApi.editDebtor({ id: caseInfo.value.debtorId, realDebtorCardId: realDebtorCardId.value }).then((res) => {
			listInfo()
		})
	}
	const showPlaintext = (rowIndex) => {
		let type = ''
		switch (rowIndex) {
			case 1:
				type = 'CARD_ID'
				break
			case 3:
				type = 'ADDRESS'
				break
			case 4:
				type = 'NOW_ADDRESS'
				break
		}
		debtorApi.getPlaintextById(caseInfo.value.debtorId, type).then((res) => {
			dataSource.value[rowIndex].key6 = res
		})
	}
	const singleCall = () => {
		complaintApi.checkComplaintUser(caseInfo.value.debtorCardId).then((res) => {
			if (res == null || res.length === 0) {
				const params = {
					callRecipient: '本人',
					relationship: '本人',
					workType: 1,
					projectCode: caseInfo.value.projectCode,
					debtorCardId: caseInfo.value.debtorCardId,
					liaisonName: caseInfo.value.debtorName,
					liaisonPhone: caseInfo.value.debtorCasePhone
				}
				emit('callEvent', params)
			}
		})
	}
	onMounted(() => {
		listInfo()
	})
</script>
